import { ref, readonly } from "vue";

const toasts = ref([]);
let toastId = 0;

export function useToast() {
  const toast = (options) => {
    const id = toastId++;
    toasts.value.push({ ...options, id });
    setTimeout(() => {
      toasts.value = toasts.value.filter((t) => t.id !== id);
    }, 3000); // Auto-dismiss after 3 seconds
  };

  return {
    toast,
    toasts: readonly(toasts),
  };
}
